<template>
    <div>
        <Header></Header>
        <div style="background: #eee">
            <!-- 面包屑导航 -->
            <div class="nav-wrap">
                <p class="nav-p-pc" style="margin-top: -25px; text-align: left">
                    <a href="/">课程列表</a>
                    <span class="sharp-content">&gt;</span>
                    <span class="nav-sec">账户设置</span>
                </p>
            </div>
        </div>
        <div class="container">
            <el-container>
                <el-aside width="150px">
                <!-- 账户设置垂直菜单侧栏 -->
                    <el-menu router>
                        <el-menu-item index="/basicSetting">
                            <i class="el-icon-setting"></i>
                            <span slot="title">基本设置</span>
                        </el-menu-item>
                        <el-menu-item index="/updatePassword">
                            <i class="el-icon-setting"></i>
                            <span slot="title">修改密码</span>
                        </el-menu-item>
                    </el-menu> 
                </el-aside>
                <el-main>
                    <router-view :user="user"></router-view>
                </el-main>
            </el-container>
        </div>
        <Footer></Footer>
    </div>
</template>

<script>
import Header from "./../Header/Header"; //顶部登录条
import Footer from "./../Footer/index"; //顶部登录条
export default {
    name: "Setting",
    components: {
        Header,
        Footer,
    },
    data() {
        return {
            user: null,
        };
    },
    created() {
        this.user = this.$route.params.user; //从路由中获取参数对象并赋值给本组件的参数
        console.log(this.user);
    },
    methods: {},
};
</script>

<style>
.container {
    width: 750px;
    margin: 0 auto;
}
.nav-wrap {
    padding-top: 40px;
    height: 50px;
    background: #fff;
}
.nav-p-pc {
    font-size: 16px;
    margin: 17px auto;
    vertical-align: top;
    width: 750px;
}
.nav-p-pc a:active,
.nav-p-pc a:link,
.nav-p-pc a:visited {
    color: #666;
}
.nav-p-pc .sharp-content {
    color: #666;
    margin-left: 5px;
}
.nav-p-pc .nav-sec {
    margin-left: 5px;
    color: #999;
}
</style>


